<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../css/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="../css/app.css" />
		<style type="text/css">
			.profile-card {
				width: 100%;
				text-align: center;
				color: white;
				padding: 30px 0;
				line-height: 1.4;
				background-color: #fff;
				background: url(../image/member/memberbg.jpg) no-repeat;
				background-size: cover;
				text-shadow: rgba(0, 0, 0, 0.4) 0px 1px 0px;
			}
			.profile-image {
				height: 100px;
				width: 100px;
				border-radius: 50%;
				-webkit-border-radius: 50%;
				background-color: black;
				border 1px solid white;
				box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 0px 0px;
				-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 0px 0px;
			}
			.profile-name {
				margin: 20px 0 0 0;
				font-weight: 600;
				font-size: 17px;
			}
			.profile-id {
				margin: 0 0 5px 0;
				font-size: 14px;
				opacity: 0.6;
			}
			.profile-desc {
				font-size: 15px;
				opacity: 0.6;
				width: 90%;
				text-align: center;
				margin: 0 auto;
			}
			.info-col {
				height: 60px;
				line-height: 1;
				padding: 12px 0 12px 4px;
			}
			.info-num {
				font-size: 16px;
				font-weight: 500;
				opacity: 0.8;
			}
			.info-unit {
				margin-top: 6px;
				font-size: 14px;
				opacity: 0.4;
			}
			.mui-btn-block {
				padding: 10px 30px;
			}
			.mui-button-row {
				/* height: 30px; */
				
				position: relative;
				padding: 10px 30px;
			}
			h5 {
				font-size: 18px;
			}
			.mui-btn-primary {
				background-color: #0bc188;
				border: 1px solid #0BC188;
			}
			.mui-btn-negative {
				background-color: #f6661f;
				border: 1px solid #F6661F;
			}
		</style>
	</head>

	<body>
		<div class="mui-content"  style="background-color: #fff;">
			<div class="profile-card">
				<img src="../image/default_user_portrait.gif" class="profile-image" id="avator">
				<div class="profile-name" id="name"></div>
				<div class="profile-id" id="money"></div>
				<div class="profile-desc" id="des"></div>
			</div>
			<ul class="mui-table-view" id="func">
				<li class="mui-table-view-cell">
					<a class="mui-navigate-right" href="changepassword.html">
						<h5>&nbsp;修改密码</h5>
					</a>
				</li>
				<li class="mui-table-view-cell">
					<a href="wrong.html" class="mui-navigate-right">
						<h5>&nbsp;我的错题</h5>
					</a>
				</li>
				<li class="mui-table-view-cell">
					<a id="coupon" class="mui-navigate-right" href="analytic.html">
						<h5>&nbsp;数据统计</h5>
					</a>
				</li>
				<br/>
			</ul>
		</div>
		<script src="../script/mui.min.js"></script>
		<script src="../script/app.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" charset="utf-8">
			function showloginstatus() {
				if (getUserKey()) {
					document.getElementById("login").style.display = "none";
					document.getElementById("logout").style.display = "block";
				} else {
					document.getElementById("login").style.display = "block";
					document.getElementById("logout").style.display = "none";
				}
			}

			function showMemberInfo() {
				var url = MYAPP.webroot + "/mobile/index.php?act=member_index";
				var key = getUserKey();
				var data = {
					key: key
				};
				api.ajax({
					url: url,
					method: 'post',
					timeout: 30,
					data: {
						values: data
					},
					dataType: 'json',
					returnAll: false
				}, function(ret, err) {
					if (ret) {
						if(typeof(ret.datas.member_info)!="undefined"){
							var info  =ret.datas.member_info;
							document.getElementById("name").innerHTML=info.user_name;
							document.getElementById("avator").src=info.avator;
							var moneyStr = "预存款："+info.predepoit+" 充值卡:"+info.available_rc_balance;
							var desStr = "积分："+info.point;
							document.getElementById("money").innerHTML=moneyStr;
							document.getElementById("des").innerHTML=desStr;
							
						}
						api.hideProgress();
					} else {
						api.toast({
							msg: ('错误码：' + err.code + '；错误信息：' + err.msg + '网络状态码：' + err.statusCode)
						});
					};
				});
			}
			apiready = function() {
				showloginstatus();
				showMemberInfo();
				api.addEventListener({
				    name: 'loginsuccess'
				}, function(){
					document.getElementById("login").style.display = "none";
					document.getElementById("logout").style.display = "block";
					showMemberInfo();
				});
					
				document.getElementById("logout").addEventListener("tap", function() {
					var url = MYAPP.webroot+"/mobile/index.php?act=logout&username=zhangyanzt&client=wap&key="+MYAPP.key;
					MYAPP.key=false;
					localStorage.removeItem('key');
					api.toast({
						msg: '注销成功',
						location: 'middle'
					});
					document.getElementById("login").style.display = "block";
					document.getElementById("logout").style.display = "none";
				});
				document.getElementById("login").addEventListener("tap", function() {
					login();
				});
				document.getElementById("des").addEventListener("tap", function() {
					login();
				});
				mui('#func').on('tap', 'a', function() {
					if (getUserKey()) {
						var url = this.getAttribute('href');
						if (url != "#") {
							api.openWin({
								name: url,
								url: url,
								animation: MYAPP.animation
							});
						}
					} else {
						api.toast({
							msg: '请先登录！',
							location: 'middle',
							duration: 1000
						});
						setTimeout('login()', 1000);
					}
				});
			}
		</script>
	</body>

</html>